<template>
	<view>
		<view class="top" :style="{marginTop:height}">
			<image src="/static/Vector.png" style="width: 20.99rpx;height: 36.26rpx;margin-right: 15rpx;" mode=""
				@click="back"></image>查学校
			<image src="/static/xschool/Group_2146.png" class="top__bg" mode=""></image>
		</view>
		<view class="con" :style="{height:'calc(100vh - 40rpx - 164rpx - 40rpx - 40rpx - '+height+' - '+bheight+')'}">
			<view class="" style="position: relative;">
				<textarea class="con__texta" placeholder="这一刻的想法" @blur="bindTextAreaBlur">
				</textarea>
				<image src="/static/xschool/Vector (1).png" class="con__bj" mode=""></image>
			</view>
			<view class="" style="flex: 1;margin-top: 24rpx;width: 100%;">
				<u-parse :tagStyle="style" :content="txtcontent"></u-parse>
			</view>
			<u-button :customStyle="{
				height:'80.15rpx',
				fontSize:'30rpx',
				width:'618.32rpx',
				color:'#00456A',
			}" color="#a4caff" shape='circle' @click="submit" :loading="loading" text="发布"></u-button>
		</view>
		<u-popup :show="show" mode='center' bgColor='transparent'>
			<view class="popbox">
				<view class="popbox__bg">
					<image src="/static/bwx/Ellipse_6.png" class="popbox__bg__icon" mode=""></image>
					<image src="/static/bwx/Vector 2.png" class="popbox__bg__icon1" mode=""></image>

				</view>
				<view class="popbox__title">
					发布成功
				</view>
				<view class="popbox__tip">
					等待审核通过
				</view>
				<view class="popbox__tip2">
					学途进阶，志展鸿图
				</view>
				<u-button :customStyle="{
					height:'76.34rpx',
					fontSize:'30rpx',
					width:'349.24rpx',
					color:'#00456A',
					margin:'0',
				}" color="#93d8ff" shape='circle' @click="back" text="确定"></u-button>
			</view>
		</u-popup>
	</view>
</template>

<script>
	import school from '@/api/_school.js'
	import home from '@/api/_home.js'
	export default {
		data() {
			return {
				show: false,
				context: '',
				loading: false,
				txtcontent:'',
				style:{
					span:'font-size: 23rpx!important;color: #747474!important;line-height: 28rpx;!important',
					p:'font-size: 23rpx!important;color: #747474!important;line-height: 28rpx;!important'
				}
			};
		},
		computed: {
			height() {
				const height = `calc(${uni.$u.addUnit(uni.$u.sys().statusBarHeight, 'px')})`
				return uni.$u.deepMerge(height)
			},
			bheight() {
				const height = uni.$u.addUnit(uni.$u.sys().safeAreaInsets.bottom, 'px');
				return uni.$u.deepMerge(height)
			},
		},
		methods: {
			bindTextAreaBlur: function(e) {
				this.context=e.detail.value
			},
			async gettxt(){
				let res = await home.config({name:'siteRelease'})
				if(res.data.code==200){
					this.txtcontent=res.data.data.siteRelease
				}
			},
			async submit() {
				if (!this.context) {
					uni.$u.toast('请输入需要发布的内容')
					return
				}
				this.loading = true
				let res = await school.add_comments({
					context: this.context
				})
				if (res.data.code == 200) {
					uni.$u.toast('发布成功')
					this.loading = false
					this.show = true
				} else {
					this.loading = false
				}
			}
		},
		onLoad() {
			this.gettxt()
		}
	}
</script>

<style lang="scss">
	page {
		background: url('https://mp-b54a63ff-3ce2-4df8-8d6e-f855d8976d34.cdn.bspapp.com/img/Rectangle_106.png') 100% no-repeat;
		background-position: top;
		background-color: #f0fffc;
		width: 750rpx;
	}

	.top {
		padding: 40rpx 0 146rpx 30rpx;
		font-family: Alimama ShuHeiTi, Alimama ShuHeiTi;
		font-weight: bold;
		font-size: 46rpx;
		color: #000000;
		line-height: 40rpx;
		position: relative;

		&__bg {
			width: 152.67rpx;
			height: 166.03rpx;
			position: absolute;
			bottom: 0;
			right: 167rpx;
		}
	}

	.con {
		padding: 0 24rpx 55rpx;
		display: flex;
		flex-direction: column;
		align-items: center;

		&__texta {
			width: 600rpx;
			height: 574rpx;
			background: #fff;
			border-radius: 38rpx 38rpx 38rpx 38rpx;
			padding: 32rpx 50rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: 400;
			font-size: 27rpx;
			color: #333;
			line-height: 40rpx;
			text-indent: 30rpx;
		}

		&__bj {
			width: 26.72rpx;
			height: 26.72rpx;
			position: absolute;
			top: 40rpx;
			left: 49rpx;
		}

		&__text {
			font-family: PingFang SC, PingFang SC;
			font-weight: 400;
			font-size: 27rpx;
			color: #747474;
			line-height: 40rpx;
			margin-bottom: 9rpx;
			padding-left: 40rpx;
		}
	}

	.popbox {
		width: 489rpx;
		height: 578rpx;
		background: linear-gradient(322deg, #FFFFFF 0%, #E3FFF9 38%, #D7ECFF 85%);
		box-shadow: 11rpx 15rpx 11rpx -2rpx rgba(0, 0, 0, 0.25);
		border-radius: 57rpx 57rpx 57rpx 57rpx;
		display: flex;
		flex-direction: column;
		align-items: center;

		&__bg {
			width: 148.85rpx;
			height: 148.85rpx;
			position: relative;
			margin-top: 70rpx;
			box-shadow: 0rpx 12rpx 26rpx 6rpx #7fcde2;
			border-radius: 50%;
			overflow: hidden;

			&__icon {
				width: 148.85rpx;
				height: 148.85rpx;
				position: absolute;
				top: 0;
				left: 0;
			}

			&__icon1 {
				width: 78.24rpx;
				height: 66.79rpx;
				position: absolute;
				left: 38rpx;
				top: 44rpx;
			}
		}

		&__title {
			font-family: PingFang SC, PingFang SC;
			font-weight: 400;
			font-size: 38rpx;
			color: #576E7A;
			line-height: 48rpx;
			margin-top: 50rpx;
		}

		&__tip {
			font-family: PingFang SC, PingFang SC;
			font-weight: 400;
			font-size: 26rpx;
			color: #576E7A;
			line-height: 48rpx;
		}

		&__tip2 {
			font-family: PingFang SC, PingFang SC;
			font-weight: 400;
			font-size: 27rpx;
			color: #5C98FF;
			line-height: 48rpx;
			margin-top: 40rpx;
			margin-bottom: 10rpx;
		}
	}
</style>